import 'package:flutter/material.dart';
import 'package:flutter_popup/flutter_popup.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:percent_indicator/circular_percent_indicator.dart';
import 'package:percent_indicator/linear_percent_indicator.dart';
import 'package:tv_friso_screen/painter/chart_bean.dart';
import 'package:tv_friso_screen/painter/view/chart_bar.dart';
import 'package:tv_friso_screen/painter/view/chart_column_bar_line.dart';
import 'package:tv_friso_screen/painter/view/chart_hor_bar.dart';
import 'package:tv_friso_screen/painter/view/chart_line.dart';
import 'package:tv_friso_screen/utils/result_check_utils.dart';

import '../data_model/sale_data.dart';
import '../model/response_with_object.dart';
import '../net/api_address.dart';
import '../net/data_helper.dart';
import '../net/http_manager.dart';

//销售
class SalesPagePad extends StatefulWidget {
  const SalesPagePad({super.key});

  @override
  State<SalesPagePad> createState() => _SalesPageState();
}

class _SalesPageState extends State<SalesPagePad>
    with AutomaticKeepAliveClientMixin {
  @override
  bool get wantKeepAlive => true;

  ScrollController autoScontroller = ScrollController();
  List<String> zoneIndex = ["东区", "西区", "南区", "北区"];
  SaleData? saleData;
  var selectIndex = 0; //分类明细 商品选择下标

  void getSaleData() async {
    var params = {};
    var formData = DataHelper.getBaseMapParams(params);
    var response =
        await HttpManager().get(ApiAddress.getSaleData, query: formData);

    if (mounted) {
      if (response['data'] != null &&
          response['code'] == HttpManager.codeSuccess) {
        ResponseWithObject<SaleData> data =
            ResponseWithObject.fromJson(response as Map<String, dynamic>, (j) {
          if (j != null) {
            return SaleData.fromJson(j);
          } else {
            return j;
          }
        });
        if (data.code == HttpManager.codeSuccess) {
          //给首页赋值
          setState(() {
            saleData = data.data;
          });
        } else {
          ResultCheckUtils.checkResult(context, data.code, data.msg);
        }
      } else {
        ResultCheckUtils.checkResult(
            context, response['code'], response['msg']);
      }
    }
  }

  String selectedOption = "Option 1";

  List<String> options = [
    'Option 1',
    'Option 2',
    'Option 3',
  ];

  late double scale;

  @override
  void initState() {
    super.initState();

    scale = ScreenUtil().screenHeight > 414
        ? 0.4
        : (ScreenUtil().screenHeight > 411 ? 0.3 : 0.25);

    getSaleData();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);

    return Scaffold(
      body: Container(
        width: double.infinity,
        height: double.infinity,
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage(
              "assets/images/icon_bg_back.png",
            ),
            fit: BoxFit.fill,
          ),
        ),
        child: Container(
          margin: EdgeInsets.only(
            bottom: 90.w,
            top: 150.w,
            left: 70.w,
            right: 55.w,
          ),
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Expanded(
                child: saleData == null || saleData!.regionShop == null
                    ? Container()
                    : Column(
                        children: [
                          //东西南北
                          Expanded(
                            child: zoneWidget(saleData!.regionShop.zoneEast, 0),
                          ),
                          Expanded(
                            child: zoneWidget(saleData!.regionShop.zoneWest, 1),
                          ),
                          Expanded(
                            child:
                                zoneWidget(saleData!.regionShop.zoneSouth, 2),
                          ),
                          Expanded(
                            child:
                                zoneWidget(saleData!.regionShop.zoneNorth, 3),
                          ),
                        ],
                      ),
              ),
              SizedBox(
                width: 30.w,
              ),
              Expanded(
                child: Column(
                  children: [
                    Expanded(
                      child: Row(
                        children: [
                          Expanded(
                            child: Column(
                              children: [
                                underline(10.w, 0.w, 20.w, 30.w),
                                Row(
                                  children: [
                                    SizedBox(
                                      width: 11.w,
                                    ),
                                    Image.asset(
                                      "assets/images/icon_trangle.png",
                                      width: 14.w,
                                      height: 29.w,
                                    ),
                                    SizedBox(
                                      width: 10.w,
                                    ),
                                    Text(
                                      "年度目标完成",
                                      style: TextStyle(
                                        color: const Color(0xFFFFFFFF),
                                        fontSize: 26.sp,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                                underline(19.w, 0.w, 20.w, 30.w),
                                Expanded(
                                  child: Container(
                                    color: const Color(0x260085F7),
                                    child: Row(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.center,
                                      children: [
                                        SizedBox(
                                          width: 15.w,
                                        ),
                                        CircularPercentIndicator(
                                          radius: 50.w,
                                          lineWidth: 7.w,
                                          percent: saleData == null ||
                                                  saleData!.yearTarget == null
                                              ? 0
                                              : double.parse(saleData!
                                                      .yearTarget
                                                      .yearTargetRate) /
                                                  100,
                                          center: Text(
                                            saleData == null ||
                                                    saleData!.yearTarget == null
                                                ? ""
                                                : "${saleData!.yearTarget.yearTargetRate}%",
                                            style: TextStyle(
                                              color: const Color(0xFFFFCA9A),
                                              fontSize: 18.sp,
                                              fontWeight: FontWeight.bold,
                                            ),
                                          ),
                                          animation: true,
                                          animationDuration: 1200,
                                          backgroundColor:
                                              const Color(0xFF34677E),
                                          progressColor:
                                              const Color(0xFF8FE1FB),
                                          circularStrokeCap:
                                              CircularStrokeCap.round,
                                        ),
                                        SizedBox(
                                          width: 15.w,
                                        ),
                                        Expanded(
                                          child: RichText(
                                            textAlign: TextAlign.start,
                                            text: TextSpan(
                                              children: [
                                                TextSpan(
                                                  text: "YTD销售额",
                                                  style: TextStyle(
                                                    color:
                                                        const Color(0xFF1ED2FF),
                                                    fontSize: 24.sp,
                                                    fontWeight:
                                                        FontWeight.normal,
                                                  ),
                                                ),
                                                TextSpan(
                                                  text: saleData == null
                                                      ? ""
                                                      : " ${saleData!.yearTarget.quarterOrderPrice} ",
                                                  style: TextStyle(
                                                    color:
                                                        const Color(0xFFFFCA9A),
                                                    fontSize: 26.sp,
                                                  ),
                                                ),
                                                TextSpan(
                                                  text: "千元",
                                                  style: TextStyle(
                                                    color:
                                                        const Color(0xFF1ED2FF),
                                                    fontSize: 26.sp,
                                                    fontWeight:
                                                        FontWeight.normal,
                                                  ),
                                                ),
                                              ],
                                            ),
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          SizedBox(
                            width: 15.w,
                          ),
                          Expanded(
                            child: Column(
                              children: [
                                underline(10.w, 0.w, 20.w, 30.w),
                                Row(
                                  children: [
                                    SizedBox(
                                      width: 11.w,
                                    ),
                                    Image.asset(
                                      "assets/images/icon_trangle.png",
                                      width: 14.w,
                                      height: 29.w,
                                    ),
                                    SizedBox(
                                      width: 10.w,
                                    ),
                                    Text(
                                      "月度销售趋势",
                                      style: TextStyle(
                                        color: const Color(0xFFFFFFFF),
                                        fontSize: 26.sp,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                                underline(19.w, 0.w, 20.w, 30.w),
                                Expanded(
                                  child: Container(
                                    color: const Color(0x260085F7),
                                    child: Stack(
                                      children: [
                                        saleData == null ||
                                                saleData!
                                                    .yTDProductSaleChart.isEmpty
                                            ? Container()
                                            : buildChartColumnBarCircle(
                                                context),

                                        //单位
                                        Row(
                                          mainAxisAlignment:
                                              MainAxisAlignment.end,
                                          children: [
                                            Container(
                                              width: 10.w,
                                              height: 10.w,
                                              color: Colors.blue,
                                            ),
                                            SizedBox(
                                              width: 5.w,
                                            ),
                                            Text(
                                              saleData == null ||
                                                      saleData!
                                                          .yTDProductChartLine
                                                          .isEmpty
                                                  ? ""
                                                  : saleData!
                                                      .yTDProductChartLine[0]
                                                      .lineName,
                                              style: TextStyle(
                                                color: const Color(0xFFFFFFFF),
                                                fontSize: 12.sp,
                                              ),
                                            ),
                                            SizedBox(
                                              width: 20.w,
                                            ),
                                            Container(
                                              width: 10.w,
                                              height: 10.w,
                                              color: Colors.orange,
                                            ),
                                            SizedBox(
                                              width: 5.w,
                                            ),
                                            Text(
                                              saleData == null ||
                                                      saleData!
                                                          .yTDProductChartLine
                                                          .isEmpty
                                                  ? ""
                                                  : saleData!
                                                      .yTDProductChartLine[1]
                                                      .lineName,
                                              style: TextStyle(
                                                color: const Color(0xFFFFFFFF),
                                                fontSize: 12.sp,
                                              ),
                                            ),
                                          ],
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: Row(
                        children: [
                          Expanded(
                            child: Column(
                              children: [
                                underline(20.w, 0.w, 20.w, 30.w),
                                Row(
                                  children: [
                                    SizedBox(
                                      width: 11.w,
                                    ),
                                    Image.asset(
                                      "assets/images/icon_trangle.png",
                                      width: 14.w,
                                      height: 29.w,
                                    ),
                                    SizedBox(
                                      width: 10.w,
                                    ),
                                    Text(
                                      "产品品类排行",
                                      style: TextStyle(
                                        color: const Color(0xFFFFFFFF),
                                        fontSize: 26.sp,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                                underline(20.w, 0.w, 20.w, 30.w),
                                Expanded(
                                  child: Container(
                                    color: const Color(0x260085F7),
                                    child: Stack(
                                      children: [
                                        saleData == null ||
                                                saleData!.productCategoryRanking
                                                    .isEmpty
                                            ? Container()
                                            : buildChartHorBarCircle(context),
                                        Row(
                                          mainAxisAlignment:
                                              MainAxisAlignment.end,
                                          children: [
                                            Container(
                                              padding: EdgeInsets.only(
                                                  top: 5.w, right: 5.w),
                                              child: Text(
                                                "(单位:听)",
                                                style: TextStyle(
                                                  color:
                                                      const Color(0xFFFFFFFF),
                                                  fontSize: 12.sp,
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          SizedBox(
                            width: 15.w,
                          ),
                          Expanded(
                            child: Column(
                              children: [
                                underline(20.w, 0.w, 20.w, 30.w),
                                Row(
                                  children: [
                                    SizedBox(
                                      width: 11.w,
                                    ),
                                    Image.asset(
                                      "assets/images/icon_trangle.png",
                                      width: 14.w,
                                      height: 29.w,
                                    ),
                                    SizedBox(
                                      width: 10.w,
                                    ),
                                    Text(
                                      "YTD城市销售排行",
                                      style: TextStyle(
                                        color: const Color(0xFFFFFFFF),
                                        fontSize: 26.sp,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                                underline(19.w, 0.w, 20.w, 30.w),
                                Expanded(
                                  child: Container(
                                    color: const Color(0x260085F7),
                                    //柱状图
                                    child: Stack(
                                      children: [
                                        saleData == null ||
                                                saleData!.cityRanking.isEmpty
                                            ? Container()
                                            : buildChartBarCircle(context),
                                        Row(
                                          mainAxisAlignment:
                                              MainAxisAlignment.end,
                                          children: [
                                            Container(
                                              padding: EdgeInsets.only(
                                                  top: 5.w, right: 5.w),
                                              child: Text(
                                                "(单位:听)",
                                                style: TextStyle(
                                                  color:
                                                      const Color(0xFFFFFFFF),
                                                  fontSize: 12.sp,
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: Row(
                        children: [
                          Expanded(
                            child: Column(
                              children: [
                                underline(20.w, 0.w, 20.w, 30.w),
                                Row(
                                  children: [
                                    SizedBox(
                                      width: 11.w,
                                    ),
                                    Image.asset(
                                      "assets/images/icon_trangle.png",
                                      width: 14.w,
                                      height: 29.w,
                                    ),
                                    SizedBox(
                                      width: 10.w,
                                    ),
                                    Text(
                                      "分类明细",
                                      style: TextStyle(
                                        color: const Color(0xFFFFFFFF),
                                        fontSize: 26.sp,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                    Expanded(
                                      child: Container(
                                        color: const Color(0x260085F7),
                                        padding: EdgeInsets.only(
                                            top: 5.w, bottom: 5.w, right: 10.w),
                                        child: Row(
                                          mainAxisAlignment:
                                              MainAxisAlignment.end,
                                          children: [
                                            Text(
                                              "",
                                              style: TextStyle(
                                                color: const Color(0xFFFFFFFF),
                                                fontSize: 26.sp,
                                                fontWeight: FontWeight.bold,
                                              ),
                                              textAlign: TextAlign.end,
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                    CustomPopup(
                                      showArrow: true,
                                      arrowColor: const Color(0x71FAFCFE),
                                      backgroundColor: const Color(0x71FAFCFE),
                                      contentPadding: EdgeInsets.only(
                                          left: 10.w,
                                          right: 10.w,
                                          bottom: 10.w,
                                          top: 10.w),
                                      contentRadius: 10.w,
                                      content: saleData == null ||
                                              saleData!.productDetails.isEmpty
                                          ? Container()
                                          : Column(
                                              mainAxisSize: MainAxisSize.min,
                                              children: List.generate(
                                                  saleData!
                                                      .productDetails.length,
                                                  (index) => GestureDetector(
                                                        onTap: () {
                                                          setState(() {
                                                            selectIndex = index;
                                                          });
                                                          Navigator.of(context)
                                                              .pop();
                                                        },
                                                        child: Container(
                                                          height: 40.w,
                                                          child: Column(
                                                            children: [
                                                              Text(
                                                                saleData!
                                                                    .productDetails[
                                                                        index]
                                                                    .goodsLineName,
                                                                style:
                                                                    TextStyle(
                                                                  color: const Color(
                                                                      0xFF1ED2FF),
                                                                  fontSize:
                                                                      20.sp,
                                                                  fontWeight:
                                                                      FontWeight
                                                                          .w500,
                                                                ),
                                                              ),
                                                              /*Container(
                                                              width: 100.w,
                                                              height: 0.5.w,
                                                              color: const Color(
                                                                  0xff0085F7),
                                                            ),*/
                                                            ],
                                                          ),
                                                        ),
                                                      )),
                                            ),
                                      child: Container(
                                        color: const Color(0x260085F7),
                                        padding: EdgeInsets.only(
                                            top: 5.w, bottom: 5.w, right: 10.w),
                                        child: Row(
                                          mainAxisAlignment:
                                              MainAxisAlignment.end,
                                          children: [
                                            Text(
                                              saleData == null ||
                                                      saleData!.productDetails
                                                          .isEmpty
                                                  ? ""
                                                  : saleData!
                                                      .productDetails[
                                                          selectIndex]
                                                      .goodsLineName,
                                              // "皇家源跃",
                                              style: TextStyle(
                                                color: const Color(0xFFFFFFFF),
                                                fontSize: 22.sp,
                                                fontWeight: FontWeight.bold,
                                              ),
                                              textAlign: TextAlign.end,
                                            ),
                                            SizedBox(
                                              width: 10.w,
                                            ),
                                            Image.asset(
                                              "assets/images/sales_2.webp",
                                              width: 25.w,
                                              height: 25.w,
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                                underline(19.w, 0.w, 0.w, 30.w),
                                Expanded(
                                  child: Container(
                                    padding:
                                        EdgeInsets.only(top: 15.w, bottom: 5.w),
                                    color: const Color(0x260085F7),
                                    child: Column(
                                      children: [
                                        Row(
                                          children: [
                                            SizedBox(
                                              width: 15.w,
                                            ),
                                            Expanded(
                                              child: Row(
                                                mainAxisAlignment:
                                                    MainAxisAlignment.center,
                                                children: [
                                                  Container(
                                                    width: 10.w,
                                                    height: 10.w,
                                                    decoration: BoxDecoration(
                                                      color: const Color(
                                                          0xFF1ED2FF),
                                                      borderRadius:
                                                          BorderRadius.all(
                                                              Radius.circular(
                                                                  25.w)),
                                                    ),
                                                  ),
                                                  SizedBox(
                                                    width: 5.w,
                                                  ),
                                                  Text(
                                                    "本月销量占比",
                                                    style: TextStyle(
                                                      color: const Color(
                                                          0xFF1ED2FF),
                                                      fontSize: 20.sp,
                                                      fontWeight:
                                                          FontWeight.normal,
                                                    ),
                                                  ),
                                                ],
                                              ),
                                            ),
                                            Expanded(
                                              child: Row(
                                                mainAxisAlignment:
                                                    MainAxisAlignment.center,
                                                children: [
                                                  Container(
                                                    width: 10.w,
                                                    height: 10.w,
                                                    decoration: BoxDecoration(
                                                      color: const Color(
                                                          0xFF1ED2FF),
                                                      borderRadius:
                                                          BorderRadius.all(
                                                              Radius.circular(
                                                                  25.w)),
                                                    ),
                                                  ),
                                                  SizedBox(
                                                    width: 5.w,
                                                  ),
                                                  Text(
                                                    "本月订单数量",
                                                    style: TextStyle(
                                                      color: const Color(
                                                          0xFF1ED2FF),
                                                      fontSize: 20.sp,
                                                      fontWeight:
                                                          FontWeight.normal,
                                                    ),
                                                  ),
                                                ],
                                              ),
                                            ),
                                            Expanded(
                                              child: Row(
                                                mainAxisAlignment:
                                                    MainAxisAlignment.center,
                                                children: [
                                                  Container(
                                                    width: 10.w,
                                                    height: 10.w,
                                                    decoration: BoxDecoration(
                                                      color: const Color(
                                                          0xFF1ED2FF),
                                                      borderRadius:
                                                          BorderRadius.all(
                                                              Radius.circular(
                                                                  25.w)),
                                                    ),
                                                  ),
                                                  SizedBox(
                                                    width: 5.w,
                                                  ),
                                                  Text(
                                                    "本月订单箱数",
                                                    style: TextStyle(
                                                      color: const Color(
                                                          0xFF1ED2FF),
                                                      fontSize: 20.sp,
                                                      fontWeight:
                                                          FontWeight.normal,
                                                    ),
                                                  ),
                                                ],
                                              ),
                                            ),
                                            Expanded(
                                              flex: 2,
                                              child: Text(
                                                "",
                                                style: TextStyle(
                                                  color:
                                                      const Color(0xFF1ED2FF),
                                                  fontSize: 20.sp,
                                                  fontWeight: FontWeight.normal,
                                                ),
                                                textAlign: TextAlign.start,
                                              ),
                                            ),
                                          ],
                                        ),
                                        Expanded(
                                          child: Row(
                                            children: [
                                              SizedBox(
                                                width: 15.w,
                                              ),
                                              Expanded(
                                                child: CircularPercentIndicator(
                                                  radius: 50.w,
                                                  lineWidth: 7.w,
                                                  percent: saleData == null ||
                                                          saleData!
                                                                  .productDetails ==
                                                              null
                                                      ? 0
                                                      : double.parse(saleData!
                                                              .productDetails[
                                                                  selectIndex]
                                                              .rate) /
                                                          100,
                                                  center: Text(
                                                    saleData == null ||
                                                            saleData!
                                                                .productDetails
                                                                .isEmpty
                                                        ? ""
                                                        : "${saleData!.productDetails[selectIndex].rate}%",
                                                    style: TextStyle(
                                                      color: const Color(
                                                          0xFFFFCA9A),
                                                      fontSize: 22.sp,
                                                      fontWeight:
                                                          FontWeight.bold,
                                                    ),
                                                  ),
                                                  animation: true,
                                                  animationDuration: 1200,
                                                  backgroundColor:
                                                      const Color(0xFF34677E),
                                                  progressColor:
                                                      const Color(0xFF8FE1FB),
                                                  circularStrokeCap:
                                                      CircularStrokeCap.round,
                                                ),
                                              ),
                                              Expanded(
                                                child: RichText(
                                                  textAlign: TextAlign.center,
                                                  text: TextSpan(
                                                    children: [
                                                      TextSpan(
                                                        text: saleData ==
                                                                    null ||
                                                                saleData!
                                                                    .productDetails
                                                                    .isEmpty
                                                            ? ""
                                                            : "${saleData!.productDetails[selectIndex].goodsNumber} ",
                                                        style: TextStyle(
                                                          color: const Color(
                                                              0xFFFFCA9A),
                                                          fontSize: 26.sp,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                        ),
                                                      ),
                                                      TextSpan(
                                                        text: "单",
                                                        style: TextStyle(
                                                          color: const Color(
                                                              0xFF1ED2FF),
                                                          fontSize: 20.sp,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                        ),
                                                      ),
                                                    ],
                                                  ),
                                                ),
                                              ),
                                              Expanded(
                                                child: RichText(
                                                  textAlign: TextAlign.center,
                                                  text: TextSpan(
                                                    children: [
                                                      TextSpan(
                                                        text: saleData ==
                                                                    null ||
                                                                saleData!
                                                                    .productDetails
                                                                    .isEmpty
                                                            ? ""
                                                            : "${saleData!.productDetails[selectIndex].amount} ",
                                                        style: TextStyle(
                                                          color: const Color(
                                                              0xFFFFCA9A),
                                                          fontSize: 26.sp,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                        ),
                                                      ),
                                                      TextSpan(
                                                        text: "箱",
                                                        style: TextStyle(
                                                          color: const Color(
                                                              0xFF1ED2FF),
                                                          fontSize: 20.sp,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                        ),
                                                      ),
                                                    ],
                                                  ),
                                                ),
                                              ),
                                              Expanded(
                                                flex: 2,
                                                child: Container(
                                                  height: double.infinity,
                                                  alignment: Alignment.center,
                                                  child: Column(
                                                    children: [
                                                      Text(
                                                        "品类月度目标完成百分比",
                                                        style: TextStyle(
                                                          color: const Color(
                                                              0xFF1ED2FF),
                                                          fontSize: 20.sp,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                        ),
                                                        textAlign:
                                                            TextAlign.start,
                                                      ),
                                                      SizedBox(
                                                        height: 20.w,
                                                      ),
                                                      LinearPercentIndicator(
                                                        lineHeight: 10.w,
                                                        percent: saleData ==
                                                                    null ||
                                                                saleData!
                                                                    .productDetails
                                                                    .isEmpty
                                                            ? 0
                                                            : double.parse(saleData!
                                                                .productDetails[
                                                                    selectIndex]
                                                                .quarterRate),
                                                        animation: true,
                                                        animationDuration: 1200,
                                                        backgroundColor:
                                                            const Color(
                                                                0xFF34677E),
                                                        progressColor:
                                                            const Color(
                                                                0xFF8FE1FB),
                                                        center: Text(
                                                          "",
                                                          style: TextStyle(
                                                            color: const Color(
                                                                0xFF34677E),
                                                            fontSize: 22.sp,
                                                            fontWeight:
                                                                FontWeight.bold,
                                                          ),
                                                        ),
                                                        barRadius:
                                                            Radius.circular(
                                                                30.w),
                                                      ),
                                                      SizedBox(
                                                        height: 20.w,
                                                      ),
                                                      Text(
                                                        saleData == null ||
                                                                saleData!
                                                                    .productDetails
                                                                    .isEmpty
                                                            ? ""
                                                            : "${saleData!.productDetails[selectIndex].quarterRate}%",
                                                        style: TextStyle(
                                                          color: const Color(
                                                              0xFF1ED2FF),
                                                          fontSize: 20.sp,
                                                          fontWeight:
                                                              FontWeight.normal,
                                                        ),
                                                        textAlign:
                                                            TextAlign.start,
                                                      ),
                                                    ],
                                                  ),
                                                ),
                                                /*Stack(
                                                children: [
                                                  LinearPercentIndicator(
                                                    lineHeight: 20.w,
                                                    percent: 0.5,
                                                    animation: true,
                                                    animationDuration: 1200,
                                                    backgroundColor:
                                                        const Color(
                                                            0xFF34677E),
                                                    progressColor:
                                                        const Color(
                                                            0xFF8FE1FB),
                                                    center: Text(
                                                      "50%",
                                                      style: TextStyle(
                                                        color: const Color(
                                                            0xFF34677E),
                                                        fontSize: 22.sp,
                                                        fontWeight:
                                                            FontWeight.bold,
                                                      ),
                                                    ),
                                                    barRadius:
                                                        Radius.circular(30.w),
                                                  ),
                                                ],
                                              ),*/
                                              ),
                                            ],
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget underline(double top, double left, double bottom, double mWidth) {
    return Container(
      margin: EdgeInsets.only(
        top: top,
        left: left,
        bottom: bottom,
      ),
      color: const Color(0xFF0F5FAF),
      width: double.infinity,
      height: 1.5.w,
      child: Stack(
        children: [
          Container(
            color: const Color(0xff00B7FE),
            width: mWidth,
            height: 2.w,
          ),
        ],
      ),
    );
  }

  //东西南北区
  Widget zoneWidget(ZoneData data, int index) {
    return Column(
      // mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: [
        underline(10.w, 0.w, 20.w, 30.w),
        Row(
          children: [
            SizedBox(
              width: 11.w,
            ),
            Image.asset(
              "assets/images/icon_trangle.png",
              width: 14.w,
              height: 29.w,
            ),
            SizedBox(
              width: 20.w,
            ),
            Text(
              zoneIndex[index],
              style: TextStyle(
                color: const Color(0xFFFFFFFF),
                fontSize: 26.sp,
                fontWeight: FontWeight.bold,
              ),
            ),
          ],
        ),
        underline(20.w, 0.w, 30.w, 30.w),
        Expanded(
          child: Column(
            // mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  // Expanded(
                  //   child: zoneItem("本月金装活跃门店", data.goldShopNumber),
                  // ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("本月皇家活跃门店", data.prestigeShopNumber),
                  ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("本月尊悦活跃门店", data.supremeShopNumber),
                  ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("本月源悦活跃门店", data.dLShopNumber),
                  ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("本月旺玥活跃门店", data.immuShopNumber),
                  ),
                  // SizedBox(
                  //   width: 10.w,
                  // ),
                  // Expanded(
                  //   child: zoneItem("P3M金装活跃门店", data.p3MGoldShopNumber),
                  // ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("P3M皇家活跃门店", data.p3MPrestigeShopNumber),
                  ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("P3M尊悦活跃门店", data.p3MSupremeShopNumber),
                  ),
                  SizedBox(
                    width: 10.w,
                  ),
                  Expanded(
                    child: zoneItem("P3M源悦活跃门店", data.p3MDLShopNumber),
                  ),
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }

  Widget zoneItem(String title, String value) {
    return Container(
      alignment: Alignment.center,
      padding: EdgeInsets.only(
        top: 20.w,
        bottom: 20.w,
      ),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(
          Radius.circular(5.w),
        ),
        border: Border.all(
          color: const Color(0xFF829EEE),
          width: 1.w,
        ),
      ),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Expanded(
                child: Text(
                  title,
                  // maxLines: 1,
                  // overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                    color: const Color(0xFF1ED2FF),
                    fontSize: 12.sp,
                    fontWeight: FontWeight.bold,
                  ),
                  textAlign: TextAlign.center,
                ),
              ),
            ],
          ),
          SizedBox(
            height: 20.w,
          ),
          value.isEmpty
              ? emptyWidget(0, 0, 0)
              : Text(
                  value,
                  style: TextStyle(
                    color: const Color(0xFFFFCA9A),
                    fontSize: 22.sp,
                    fontWeight: FontWeight.w500,
                  ),
                ),
        ],
      ),
    );
  }

  Widget emptyWidget(double top, double left, double mWidth) {
    return Container(
      margin: EdgeInsets.only(
        top: top,
        left: left,
      ),
      color: const Color(0xff1ED2FF),
      width: 25.w,
      height: 2.w,
    );
  }

  ///bar-circle
  Widget buildChartBarCircle(context) {
    List<ChartBean> chartBeans = [];
    for (var i = 0; i < saleData!.cityRanking.length; i++) {
      chartBeans.add(ChartBean(
        x: saleData!.cityRanking[i].cname,
        y: double.parse(saleData!.cityRanking[i].nums),
        color: Colors.blue,
      ));
    }

    var chartBar = ChartBar(
      chartBeans: chartBeans,
      // [
      //   ChartBean(x: '广州市', y: 30, color: Colors.blue),
      //   ChartBean(x: '深圳市', y: 100, color: Colors.blue),
      //   ChartBean(x: '成都市', y: 70, color: Colors.blue),
      //   ChartBean(x: '西安市', y: 70, color: Colors.blue),
      //   ChartBean(x: '重庆市', y: 30, color: Colors.blue),
      //   ChartBean(x: '武汉市', y: 90, color: Colors.blue),
      //   ChartBean(x: '惠州市', y: 250, color: Colors.blue),
      // ],
      size: Size(MediaQuery.of(context).size.width,
          MediaQuery.of(context).size.height / 5 * 1.8),
      rectColor: Colors.deepPurple,
      isShowX: true,
      fontColor: Colors.white,
      rectShadowColor: Colors.white.withOpacity(0.5),
      isReverse: false,
      isCanTouch: false,
      isShowTouchShadow: false,
      isShowTouchValue: false,
      rectRadiusTopLeft: 0.w,
      rectRadiusTopRight: 0.w,
      duration: const Duration(milliseconds: 1000),
      fontSize: 12.sp,
    );
    return chartBar;
  }

  Widget buildChartHorBarCircle(context) {
    List<ChartBean> chartBeans = [];
    for (var i = 0; i < saleData!.productCategoryRanking.length; i++) {
      chartBeans.add(ChartBean(
        x: saleData!.productCategoryRanking[i].goodsLineName,
        y: double.parse(saleData!.productCategoryRanking[i].goodsNumber),
        color: Colors.blue,
      ));
    }

    var chartBar = ChartHorBar(
      chartBeans: chartBeans,
      // [
      //   ChartBean(x: '美素佳儿源跃', y: 30, color: Colors.blue),
      //   ChartBean(x: '美素佳儿米粉', y: 100, color: Colors.blue),
      //   ChartBean(x: '字母儿童粉', y: 70, color: Colors.blue),
      //   ChartBean(x: '皇家美素佳儿', y: 70, color: Colors.blue),
      //   ChartBean(x: '重庆市', y: 30, color: Colors.pink),
      //   ChartBean(x: '武汉市', y: 90, color: Colors.orange),
      //   ChartBean(x: '惠州市', y: 250, color: Colors.blue),
      // ],
      size: Size(MediaQuery.of(context).size.width,
          MediaQuery.of(context).size.height / 5 * 1.8),
      rectColor: Colors.deepPurple,
      isShowX: true,
      fontColor: Colors.white,
      rectShadowColor: Colors.white.withOpacity(0.5),
      isReverse: false,
      isCanTouch: false,
      isShowTouchShadow: false,
      isShowTouchValue: false,
      rectRadiusTopLeft: 0.w,
      rectRadiusTopRight: 0.w,
      duration: const Duration(milliseconds: 1000),
      fontSize: 12.sp,
    );
    return chartBar;
  }

  Widget buildChartLine(context) {
    var chartLine = ChartLine(
      chartBeans: [
        ChartBean(x: '12-01', y: 30),
        ChartBean(x: '12-02', y: 88),
        ChartBean(x: '12-03', y: 20),
        ChartBean(x: '12-04', y: 67),
        ChartBean(x: '12-05', y: 10),
        ChartBean(x: '12-06', y: 40),
        ChartBean(x: '12-07', y: 10),
      ],
      size: Size(MediaQuery.of(context).size.width,
          MediaQuery.of(context).size.height / 5 * 1.6),
      isCurve: true,
      lineWidth: 2,
      lineColor: Colors.yellow,
      fontColor: Colors.white,
      xyColor: Colors.white,
      shaderColors: [
        Colors.yellow.withOpacity(0.3),
        Colors.yellow.withOpacity(0.1)
      ],
      fontSize: 12,
      yNum: 4,
      isAnimation: false,
      isReverse: false,
      isCanTouch: false,
      isShowPressedHintLine: true,
      pressedPointRadius: 4,
      pressedHintLineWidth: 0.5,
      pressedHintLineColor: Colors.white,
      duration: const Duration(milliseconds: 2000),
    );
    return chartLine;
  }

  //月度销售趋势
  Widget buildChartColumnBarCircle(context) {
    List<ChartBean> chartBeans = [];
    for (var i = 0; i < saleData!.yTDProductSaleChart.length; i++) {
      chartBeans.add(ChartBean(
        x: saleData!.yTDProductSaleChart[i].months,
        y: double.parse(saleData!.yTDProductSaleChart[i].line3),
        y2: double.parse(saleData!.yTDProductSaleChart[i].line9),
        rate: double.parse(saleData!.yTDProductSaleChart[i].line3),
        rate2: double.parse(saleData!.yTDProductSaleChart[i].line9),
        color: Colors.blue,
      ));
    }

    var chartBar = ChartColumnBarLine(
      chartBeans: chartBeans,
      size: Size(MediaQuery.of(context).size.width,
          MediaQuery.of(context).size.height / 5 * 1.8),
      rectColor: Colors.deepPurple,
      isShowX: true,
      fontColor: Colors.white,
      rectShadowColor: Colors.white.withOpacity(0.5),
      isReverse: false,
      isCanTouch: false,
      isShowTouchShadow: false,
      isShowTouchValue: false,
      rectRadiusTopLeft: 0.w,
      rectRadiusTopRight: 0.w,
      duration: const Duration(milliseconds: 1000),
      fontSize: 12.sp,
      rightUnit: "日期:(年月)",
    );
    return chartBar;
  }
}
